<template>
	<div class="load">
		<div :style="ct.style" class="load-container">
			<div class="top">
				<div class="title">
					<div class="icon">
						<img src="./images/logo.png" alt="" />
					</div>
					<div class="a">
						第一志愿
					</div>
				</div>
				<img class="a" src="./images/1.png" alt="" />
				<img class="b" src="./images/2.png" alt="" />
			</div>
			<img class="c" src="./images/3.png" alt="" />
			<div class="bottom">
				<div class="container">
					<img class="d" src="./images/4.png" alt="" />
					<img class="e" src="./images/5.png" alt="" />
				</div>
				<img @click="m(10)" class="back" src="./images/back.png"/>
			</div>
		</div>
	</div>
</template>

<script>
	import scale from '@/modules/scale.js'
export default {
	name: 'load',
	data() {
		var p = {
			content: '立即下载',
			showArrow: !1
		}
		var t = {
			startx: 0,
			endx: 0,
			starty: 0,
			endy: 0
		}
		return {
			p,
			t
		}
	},
	mounted() {
	},
	computed: {
		ct() {
			var ww = window.innerWidth;
			var wh = window.innerHeight;
			return {
				style: {
					'width': ww + 'px',
					'height': wh + 'px'
				}
			}
		},
		scale:scale.scale
	},
	methods: {
		m(index) {
			this.$emit('m',index)
			//				this.$router.push({path:'/'})
		}
	}
}
</script>

<style lang="less" scoped>
.load {
	.load-container {
		background: #fff;
		height: 100%;
		position: relative;
		margin:-30px auto 0;
		>img.c {
			position: absolute;
			width: 70%;
			left: 0;
			top: 115px;
			right: 0;
			margin: auto;
		}
		.bottom {
			height:50%;
			.back {
				position: absolute;
				left: 10px;
				bottom: 20px;
				width: 50px;
			}
			.container {
				position: relative;
				img.d {
					position: absolute;
					width: 35%;
					left: 30px;
					top: 20%;
				}
				img.e {
					position: absolute;
					width: 35%;
					right: 30px;
					top: 20%;
				}
			}
		}
		.top {
			box-sizing: border-box;
			position: relative;
			padding-top: 30px;
			background: #2c8bfd;
			height: 50%;
			overflow: hidden;
			>img.a {
				position: absolute;
				margin: auto;
				bottom: -105px;
				left: 0;
				right: 0;
				width: 330px;
			}
			>img.b {
				position: absolute;
				left: 0px;
				width: 96%;
				top: 70px;
			}
			.title {
				height: 30px;
				width: auto;
				box-sizing: border-box;
				text-align: center;
				padding-left:20%;
				.icon {
					float: left;
					margin-left: 13px;
					background: #fff;
					height: 50px;
					width: 50px;
					text-align: center;
					line-height: 50px;
					border-radius: 5px;
					img {
						width: 80%;
					}
				}
				.a {
					float: left;
					height: 50px;
					line-height: 50px;
					padding-left: 14px;
					font-size: 24px;
					color: #fff;
				}
				:after {
					content: '';
					clear: both;
				}
			}
		}
	}
}
</style>